<template>
    <!-- App -->
    <div id="app">
        <f7-statusbar></f7-statusbar>
        <f7-view main url="/tabs/">
        </f7-view>
        <f7-login-screen class="demo-login-screen" :opened="loginScreenOpened"
                         @loginscreen:closed="loginScreenOpened = false">
            <f7-page login-screen>
                <f7-login-screen-title>Framework7</f7-login-screen-title>
                <f7-list form>
                    <f7-list-item>
                        <f7-label>Username</f7-label>
                        <f7-input type="text" placeholder="Your username"></f7-input>
                    </f7-list-item>
                    <f7-list-item>
                        <f7-label>Password</f7-label>
                        <f7-input type="password" placeholder="Your password"></f7-input>
                    </f7-list-item>
                </f7-list>
                <f7-list>
                    <f7-list-button @click="signIn">Sign In</f7-list-button>
                    <!--<f7-list-button @click="loginScreenOpened=false">暂不登录</f7-list-button>-->
                    <f7-list-button @click="waitLogin">暂不登录</f7-list-button>
                    <f7-block-footer>Some text about login information.<br>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </f7-block-footer>
                </f7-list>
            </f7-page>
        </f7-login-screen>
    </div>
</template>
<script>

  export default {
    // mounted () {
    //   console.log(this.$device)
    // },
    data () {
      return {
        loginScreenOpened: false,
        toUrl: ''
      }
    },
    created () {
      let self = this
      document.addEventListener('deviceready', self.onDeviceReady, false)
      self.$bus.on('loginDialog', function(url){
        self.toUrl = url
        self.loginScreenOpened = true
      })
    },
    methods: {
      signIn () {
        let self = this
        let app = self.$f7
        app.dialog.alert(`Username: ${self.username}<br>Password: ${self.password}`, () => {
          app.loginScreen.close()
          sessionStorage.setItem('token','111111')
          if(self.toUrl){
            console.log(self.$f7.router)
            self.$f7.router.navigate(self.toUrl)
          }
          self.$bus.emit('loginCallBack', true)
          // self.$emit('funLogin', true)
        })
      },
      waitLogin(){
        let self = this
        let app = self.$f7
        app.loginScreen.close()
        self.$bus.emit('loginCallBack', false)
        // self.$emit('funLogin', false)
        // self.isLogin = false
      },
      onDeviceReady () {
        document.addEventListener('backbutton', this.onBackKeyDown, false)
      },
      onBackKeyDown: function () {
        // 获取当前view this.$f7.views.main.router.url  this.$$('.modal-in').length  this.$f7.views.current.router.b
        const myApp = this.$f7
        console.log('this', this)
        console.log('myApp', this.$f7)
//        alert(myApp.views.current.router.url)
        if (this.$$('.modal-in').length > 0) {
          alert('modal-in')
          myApp.dialog.close()
          return false
        } else if (myApp.views.current.router.url.indexOf('tab') > 0) {
          myApp.dialog.confirm('你确定要退出?', '提示', () => {
            navigator.app.exitApp()
          })
        } else {
          myApp.views.current.router.back()
        }
      },
      handleClick () {
        console.log('handleClick', this)
      }
    }
  }
</script>
